<template>
  <view class="plr-10 pt-20">
    <!-- 列表 -->
    <empty v-if="list.length == 0"></empty>

    <view v-else class="flex flex-wrap flex-between" style="width: 100%">
      <view v-for="(item, index) in list" :key="index" class="collectItem plr-10">
        <view class="radius-10 mb-20 size-22">
          <image class="collectImg" :src="item.image" mode="aspectFill"></image>
          <view class="plr-20 ptb-20 white collectItem-con">
            <view class="flex flex-start">
              <view class="size-30 f-bold ell1">{{ item.name }}</view>
              <!-- <image src="../../static/homeIcon.png" class="homeIcon ml-20" mode=""></image> -->
            </view>
            <view class="flex white flex-between mt-30 size-28">
              <view class="size-30">
                价值￥<text>{{ item.price }}</text>
              </view>
              <view>
                ×<text>{{ item.count }}</text>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import empty from '../../components/empty.vue'
export default {
  components: {
    empty,
  },
  data() {
    return {
      list: [],
    }
  },
  onShow() {
    this.init()
  },
  methods: {
    // 头部按钮
    onNavigationBarButtonTap() {
      uni.navigateTo({
        url: '../my/myChip',
      })
    },
    init() {
      this.$http('api/forge/userForgeList').then(res => {
        this.list = res
      })
    },
  },
}
</script>
<style>
</style>
<style lang="less" scoped>
  page{
    background: #f5f5f5;
  }
  .white{
    color: #3c3c3c;
  }
.homeImg {
  width: 342rpx;
  height: 60rpx;
}

.collectItem {
  width: 50%;
}

.collectImg {
  // width: 330rpx;
  background-color: #21263d;
  height: 300rpx;
  width: 100%;
	display: block;
	border-radius: 10rpx 10rpx 0 0;
}

.collectItem-con {
	background: #fff;
	border-radius: 0rpx 0rpx 10rpx 10rpx;
}

.homeIcon {
  width: 30rpx;
  height: 30rpx;
}

.tipsLeft {
  background: #efaa1c;
  color: #2f2f2e;
}

.tipsRight {
  background: rgba(239, 170, 28, 0.3);
}
</style>
